<template>
  <div mb-10px>主题设置</div>
  <el-color-picker v-model="color" :predefine="predefineColors" />
</template>
<script lang="ts" setup name="ThemePicker">
import { useSettingStore } from "@/store/setting"
const settingStore = useSettingStore()
const color = ref(settingStore.theme)
const predefineColors = ref([
  "#ff4500",
  "#ff8c00",
  "#ffd700",
  "#90ee90",
  "#00ced1",
  "#1e90ff",
  "#c71585"
])

watch(color, (newVal: string) => {
  settingStore.changeTheme("theme", newVal)
})
</script>
